import React from 'react';
import { List, InputItem, Button } from 'antd-mobile';
import { SetInputData } from '@/util/set';
import { connect } from 'react-redux';
import { userLogin } from '@/redux/modules/userInfo';

@connect(
    f => ({}),
    { userLogin }
)
class Login extends SetInputData{
    constructor(props){
        super(props);

        this.state = {
            userName: '',
            password: ''
        }

        this.cm = this.cm.bind(this);
    }

    cm(){
        this.props.userLogin(this.state);
    }

    render(){

        const { setUserName, setPassword, cm } = this;
        const { userName, password } = this.state;
        
        return (
            <div>
                <h2>登录</h2>
                <List>
                    <InputItem defaultValue={userName} value={userName}  name="userName" onChange={setUserName}>用户名:</InputItem>
                    <InputItem defaultValue={password} value={password} type="password" name="password" onChange={setPassword}>密码:</InputItem>
                    <List.Item>
                        <Button type="primary" onClick={cm}>登录</Button>
                    </List.Item>
                </List>
            </div>
        )
    }
}

export default Login;